{include file="common/header"}
<script>
        $('#example-navbar-collapse>ul>li').removeClass('active')
        $($('#example-navbar-collapse>ul>li')[1]).addClass('active')
    </script>
<style>
    .form-group {
        float: unset!important;
        margin-left: auto;
        margin-right: auto;
    }

    form {
        float: unset!important;
        margin-left: auto!important;
        margin-right: auto!important;
    }

    #main-block {
        display: flex;
        justify-content: space-between;
        margin-top: 80px;
    }
</style>
<div id="main-block">
    <div class="container">

        <div class="container col-md-3" id="left-menu">
            <div id="sidebar" class="span3">
                <div class="sidebar-nav well">
                    <ul class="nav nav-list">
                        <li class="nav-header">
                            <font style="vertical-align: inherit;">
                                <font style="vertical-align: inherit;">类型选择</font>
                            </font>
                        </li>
                        <li v-for="(li,i) in items" v-bind:class="{active:hasSelect(i)}">
                            <a href="javascript:;" @click.self.prevent="onSelect(i)">
                                <font style="vertical-align: inherit;">
                                    <font style="vertical-align: inherit;"> {{ li.name }}</font>
                                </font>
                            </a>
                        </li>
                    </ul>

                </div>
            </div>
        </div>
        <script>
            // $(document).ready(function () {
            //     var a = $.session.get('key');
            //     console.log(a)
            // })
            // var pro_data = {
            //     message: parseInt($.session.get('key')),
            // }
            // $(document).ready(function () {
            //     console.log(pro_data.message)
            // })
            
            var left_menu = new Vue({
                el: '#left-menu',
                data: {
                    items: [],
                    selected: 0
                }, created: function () {
                    $.getJSON('/GQT/public/index/apply/getProList', function (data) {
                        console.log(data)
                        // var _data = JSON.parse(data)
                        left_menu.items = data
                        appFrom.items = data[0]
                    })

                }, methods: {
                    onSelect: function (e) {
                        //console.log(this.items[pro_data.message]);
                        this.items[this.selected].isSelect = false
                        //console.log(this.items[this.selected].isSelect)
                        this.items[e].isSelect = true
                        this.selected = e
                        appFrom.items = this.items[e]
                    }, hasSelect(val) {
                        if (val === this.selected) {
                            return true;
                        }
                        return false;
                    }
                }

            })
        </script>

        <style>
            .active a {
                color: white;
            }
        </style>
        <div id="app-form" class="col-md-9">

            <form class="form-inline" @submit.prevent="submit">
                <center>
                    <h3>{{items.name}}</h3>
                </center>
                <div class="region">
                    <span>
                        <strong>项目信息:</strong>
                    </span>
                    <div class="region-in">
                        <div class="form-group" v-show="items.add_name">
                            <label for="exampleInputEmail1">项目名称:</label>
                            <input type="text" class="form-control" placeholder="共青团第二课堂" v-model="value.pro_name">
                        </div>
                        <div class="form-group" v-show="items.title">
                            <label for="exampleInputEmail1">项目类型:</label>
                            <input type="text" class="form-control" placeholder="共青团第二课堂" v-model="value.pro_type">
                        </div>
                        <div class="form-group" v-show="items.school">
                            <label for="exampleInputPassword1">学&nbsp;院:</label>
                            <input type="text" class="form-control" placeholder="165042120" v-model="value.pro_school">
                        </div>
                        <div class="form-group" v-show="items.dept">
                            <label for="exampleInputPassword1">系:</label>
                            <input type="text" class="form-control" placeholder="165042120" v-model="value.pro_dept">
                        </div>
                        <div class="form-group " v-show="items.max_money">
                            <label for="exampleInputEmail1">申报金额:</label>
                            <input type="text" class="form-control" placeholder="共青团第二课堂" v-model="value.money">
                        </div>
                    </div>
                </div>
                <br>
                <div class="region">
                    <span>
                        <strong>申请人信息:</strong>
                    </span>
                    <div class="region-in">
                        <div class="form-group">
                            <label for="exampleInputPassword1">姓&nbsp;名:</label>
                            <input type="text" class="form-control" placeholder="165042120" v-model="value.stu_name">
                        </div>

                        <div class="form-group">
                            <label for="exampleInputPassword1">学&nbsp;号:</label>
                            <input type="text" class="form-control" placeholder="165042120" v-model="value.stu_id">
                        </div>
                        <div class="form-group">
                            <label for="exampleInputPassword1">人&nbsp;数:</label>
                            <input type="text" class="form-control" placeholder="165042120" v-model="value.stu_number">
                        </div>
                        <div class="form-group">
                            <label for="exampleInputPassword1">电&nbsp;话:</label>
                            <input type="text" class="form-control" placeholder="165042120" v-model="value.stu_phone">
                        </div>

                        <div class="form-group">
                            <label for="exampleInputPassword1">银行卡号:</label>
                            <input type="text" class="form-control" id="number_1" placeholder="165042120" v-model="value.stu_credit">
                        </div>

                    </div>
                </div>
                <br>
                <div class="region" v-show="items.adviser">
                    <span>
                        <strong>指导教师信息</strong>
                    </span>
                    <div class="region-in">
                        <div class="form-group">
                            <label for="exampleInputPassword1">姓&nbsp;名:</label>
                            <input type="text" class="form-control" placeholder="165042120" v-model="value.tea_name">
                        </div>

                        <br>
                        <div class="form-group">
                            <label for="exampleInputPassword1">工&nbsp;号:</label>
                            <input type="text" class="form-control" placeholder="165042120" v-model="value.tea_id">
                        </div>
                    </div>
                </div>
                <br>
                <div class="region" v-show="items.materials">
                    <span>
                        <strong>材料提交:</strong>
                    </span>
                    <div class="region-in">
                        <div class="form-group">
                            <input type="file" accept="application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" id="exampleInputFile"
                                @change="upDoc($event)">
                            <input type="hidden" v-model="value.materials">
                            <span class="help-block">请提交你的word材料</span>
                        </div>
                    </div>
                </div>
                <div class="form-group" id="apply-reason" v-show="items.describe">
                    <label for="exampleInputPassword1">申请理由:</label>
                    <textarea class="form-control" rows="5" id="content_tetx" v-model="value.describe"></textarea>
                </div>
                <div class="clearfloat"></div>
                <br>
                <br>
                <!-- <div class="checkbox">
            <label>
                <input type="checkbox"> Check me out
            </label>
        </div> -->
                <div class="form-group">
                    <input type="submit" class="btn btn-default" value="提交">
                    </button>
                </div>
            </form>


        </div>
        <script>
            var appFrom = new Vue({
                el: '#app-form',
                data: {
                    items: '',
                    value: {
                        pro_name: '',
                        pro_type: '',
                        pro_school: '',
                        pro_dept: '',
                        money: '',
                        stu_name: '',
                        stu_id: '',
                        stu_number: '',
                        stu_phone: '',
                        stu_credit: '',
                        tea_id: '',
                        tea_name: '',
                        describe: '',
                        materials: '',
                    },

                },
                created: function () {
                    // $.getJSON('/GQT/public/index/apply/getOneClass', { type: this.Etypes }, function (data) {
                    //     var _data = JSON.parse(data)
                    //     appFrom.v_class_1 = _data
                    // })

                },
                watch: {

                    items: function () {

                    }
                },
                methods: {
                    submit: function () {
                        /*
                        type 类型
                        name 奖项名称
                        stu_id 学生id
                        stu_name 学生名字
                        tea_id 指导教师名字
                        tea_name 教师名字
                        content 内容
                        oneClass 一级
                        twoClass 二级
                        */
                        if (this.value.pro_name == '' && this.items.add_name != 0) {
                            alert("请输入项目名称")
                            return;
                        }
                        if (this.value.pro_type == '' && this.items.title != 0) {
                            alert("请输入项目类型")
                            return;
                        }
                        if (this.value.pro_school == '' && this.items.school != 0) {
                            alert("请输入学院名称")
                            return;
                        }
                        if (this.value.pro_dept == '' && this.items.dept != 0) {
                            alert("请输入系别")
                            return;
                        }
                        if (this.value.money == '' && this.items.max_money != 0) {
                            alert("请输入申请钱数")
                            return;
                        }
                        if (this.value.stu_name == '') {
                            alert("请输入申请人姓名")
                            return;
                        }

                        if (this.value.stu_id == '') {
                            alert("请输入申请人学号")
                            return;
                        }
                        this.value.stu_number = parseInt(this.value.stu_number)
                        if (isNaN(this.value.stu_number)) {
                            alert("成员数量必须为数字")
                            return;
                        }
                        if (this.value.stu_number == '') {
                            alert("请输入项目成员数量")
                            return;
                        } else if (this.value.stu_number > this.items.number) {
                            alert("项目人数应小于" + this.items.number + "人")
                            return;
                        }
                        if (this.value.stu_phone == '') {
                            alert("请输入申请人手机号")
                            return;
                        }
                        if (this.value.stu_credit == '') {
                            alert("请输入申请人银行卡号")
                            return;
                        }
                        if (this.value.tea_id == '' && this.items.adviser != 0) {
                            alert("请输入指导教师id")
                            return;
                        }
                        if (this.value.tea_name == '' && this.items.adviser != 0) {
                            alert("请输入指导教师姓名")
                            return;
                        }
                        if (this.value.describe == '' && this.items.describe != 0) {
                            alert("请输入项目申请理由")
                            return;
                        }
                        if (this.value.materials == '' && this.items.materials != 0) {
                            alert("请提交申报材料")
                            return;
                        }


                        $.post('/GQT/public/index/apply/appProInfo',
                            {
                                pro_name: this.value.pro_name,
                                pro_type: this.value.pro_type,
                                pro_school: this.value.pro_school,
                                pro_dept: this.value.pro_dept,
                                money: this.value.money,
                                stu_name: this.value.stu_name,
                                stu_id: this.value.stu_id,
                                stu_number: this.value.stu_number,
                                stu_phone: this.value.stu_phone,
                                stu_credit: this.value.stu_credit,
                                tea_id: this.value.tea_id,
                                tea_name: this.value.tea_name,
                                describe: this.value.describe,
                                materials: this.value.materials,
                                class_id: this.items.id,
                                score: this.items.score,
                                // type: this.Etypes,
                                // name: this.pro_name,
                                // stu_id: this.pro_stu_id,
                                // stu_name: this.pro_stu_name,
                                // tea_id: this.pro_tea_id,
                                // tea_name: this.pro_tea_name,
                                // content: this.pro_content,
                                // oneClass: this.oneClass,
                                // twoClass: this.twoClass
                            }, function (data) {
                                _data = JSON.parse(data)
                                if (_data.status == 1) {
                                    alert(_data.message)
                                } else {
                                    alert(_data.message)
                                }

                            }).error(function () {
                                alert("申请失败,请检查信息是否正确")
                            })

                    },
                    upDoc: function (event) {
                        var file = event.target.files[0]
                        console.log(event.target.files[0])
                        if (file == undefined || file.size == 0 || !(file.type == 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' || file.type == 'application/msword')) {
                            alert("请选择word文件")
                            return;
                        }
                        var DataF = new FormData();
                        DataF.append('file', file, file.value)

                        $.ajax({
                            url: '/GQT/public/index/apply/upDoc',
                            data: DataF,
                            type: 'post',
                            cache: false,
                            processData: false,
                            contents: false,
                            contentType: false,
                            success: function (res) {
                                _data = JSON.parse(res)
                                _data = JSON.parse(_data)
                                console.log(_data.state)
                                if (_data == 0) {
                                    alert("网络错误")
                                    return
                                } else {
                                    appFrom.value.materials = "/GQT/public/" + _data.message
                                    console.log(appFrom.value.materials)
                                }
                                // var _data = JSON.parse(res)

                                // var src = '/meetTWO/public/static/picture/userHeadImg/' + _data.data + '/img.png?rand=' + Math.random()
                                // $('img').attr('src', src)
                                // alert('上传成功')
                            }, error: function () {
                                alert('网络错误')
                            }

                        })


                        console.log(event.target.files[0])
                    }
                }
            })

        </script>
        <style>
            #app-form form .form-group select {
                width: 25%;
                display: inline;
                margin: 0 20px;

            }

            .region {
                border: 1px #bbb solid;
                padding: 5% 7%;


            }

            .region-in {
                margin: 0 5%;

            }

            .form-inline .form-group {
                width: 49%;
                margin: 5px 2px;
            }

            .form-inline .form-group label {
                width: 61px;
            }

            .form-inline #apply-reason {
                width: 100%;
            }

            .form-inline #apply-reason textarea {
                width: 100%;
            }
        </style>

    </div>

</div>
{include file="common/footer"}